/*
 * @Author: yangshangchao
 * @Date: 2025-01-13 09:18:39
 * @LastEditors: yangshangchao
 * @Description: 头部注释
 */

import { useStorage } from './hooks/useStorage';
import { useHistory } from './hooks/useHistory';
const App = () => {
  const [count, setCount] = useStorage('count', 1);
  const [url, push, replace] = useHistory();
  return (
    <>
      <div>
        <h3>7-3.使用useSyncExternalStore</h3>
        <ul>
          <li>自定义useStorage订阅浏览器API-storage</li>
          <h3>value:{count}</h3>
          <button onClick={() => setCount(count + 1)}>存储+1</button>
          <button onClick={() => setCount(count - 1)}>存储-1</button>
          <li>自定义useHistory订阅浏览器API-popstate</li>
          <h3>url: {url}</h3>
          <button onClick={() => push('/aaa')}>push跳转</button>
          <button onClick={() => replace('/bbb')}>replace替换</button>
        </ul>
      </div>
    </>
  );
};

export default App;
